<template>
	<view class="container">
		<view style="display: flex;align-items:center;border-bottom: 3rpx gainsboro solid;margin-bottom: 25rpx;padding-bottom: 10rpx;">
			<view style="background-color: blue;width: 4rpx;height: 25rpx;margin-right: 10rpx;">
			</view>
			<view class="">
				给{{jingxiaoshangName}}设置折扣 
			</view>
		</view>
		
		<view v-for="item in xinghaoList" :key="item._id" class="item">
			<text>{{item.name}} ({{item.xinghao}})</text>
			<text style="color: darkgray;font-size: 25rpx;">--我的折扣: {{myDiscounts[item._id] || '无'}}</text>
			<view class="card-footer">
				<input type="number" v-model="newDiscounts[item._id]" :placeholder="`输入≥${myDiscounts[item._id]||1}的折扣`"
					@blur="validateDiscount(item._id)" />
				<view style="display: flex;background-color: dodgerblue;box-shadow: 0 2rpx 10rpx darkgray;margin-left: 15rpx; color: white;border-radius: 15rpx; align-items: center;justify-content: center; width: 100rpx;height: 55rpx;font-size: 25rpx;" @click="saveDiscount(item._id)">保 存</view>	
			</view>

		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				quankezx_name_tel: {}, // 
				jingxiaoshangName: '', // 下级经销商名称
				myDiscounts: {}, // 上级折扣
				newDiscounts: {}, // 下级代理折扣
				xinghaoList: [], // 型号列表
				jingxiaoshangId: '' // 下级ID
			}
		},
		async onLoad(option) {
			this.jingxiaoshangName=option.name
			this.jingxiaoshangId=option.id
			this.quankezx_name_tel = uni.getStorageSync('quankezx_name_tel')
			console.log(this.quankezx_name_tel);
			await this.loadXinghaoList();
			await this.loadExistingDiscounts();
			await this.loadMyDiscounts(); // 加载上级折扣
		},
		methods: {
			// 加载我的折扣
			async loadMyDiscounts() {
				const res = await uniCloud.callFunction({
					name: 'getExistingDiscounts',
					data: {
						jingxiaoshangId: this.quankezx_name_tel._id
					} 
				});
				res.result.data.forEach(item => {
					this.$set(this.myDiscounts, item.xinghao_id, item.zhekou);
					console.log("123", this.myDiscounts[item.xinghao_id]);
				});
			},
			// 验证折扣
			validateDiscount(xinghaoId) {
				const minDiscount = this.myDiscounts[xinghaoId] || 1;
				if (this.newDiscounts[xinghaoId] < minDiscount) {
					uni.showToast({
						title: `折扣不能小于${minDiscount},或联系上家设置折扣`,
						icon: 'none'
					});
					this.newDiscounts[xinghaoId] = minDiscount;
				}
			},
			// 加载型号列表
			async loadXinghaoList() {
				try {
					const res = await uniCloud.callFunction({
						name: 'getXinghaoList'
					});
					console.log("5", res);
					this.xinghaoList = res.result.data;
				} catch (e) {
					console.log("115", e);
					uni.showToast({
						title: '加载失败',
						icon: 'none'
					});
				}
			},

			// 加载已有折扣
			async loadExistingDiscounts() {
				try {
					const res = await uniCloud.callFunction({
						name: 'getExistingDiscounts',
						data: {
							jingxiaoshangId: this.jingxiaoshangId
						}
					});
					console.log("56", res);
					res.result.data.forEach(item => {
						this.$set(this.newDiscounts, item.xinghao_id, item.zhekou);
					});
				} catch (e) {
					console.error(e);
				}
			},

			// 保存折扣
			async saveDiscount(xinghaoId) {
				const newDiscounts = parseFloat(this.newDiscounts[xinghaoId]);

				if (isNaN(newDiscounts) || newDiscounts < 0 || newDiscounts > 1) {
					uni.showToast({
						title: '请输入0-1之间的数字',
						icon: 'none'
					});
					return;
				}

				try {
					await uniCloud.callFunction({
						name: 'saveDiscount',
						data: {
							xinghaoId: xinghaoId,
							jingxiaoshangId: this.jingxiaoshangId,
							zhekou: newDiscounts
						}
					});

					uni.showToast({
						title: '保存成功'
					});
				} catch (e) {
					uni.showToast({
						title: '保存失败',
						icon: 'none'
					});
				}
			}
		}
	}
</script>

<style>
	.container {
		padding: 20rpx;
	}

	.header {
		padding: 30rpx 0;
		font-size: 36rpx;
		font-weight: bold;
		text-align: center;
	}

	.card {
		margin-bottom: 30rpx;
		border-radius: 10rpx;
		background: #fff;
		box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.1);
	}

	.card-header {
		padding: 20rpx;
		border-bottom: 1rpx solid #eee;
		font-size: 32rpx;
		font-weight: bold;
	}

	.card-content {
		padding: 20rpx;
		color: #666;
	}

	.card-footer {
		padding: 20rpx;
		display: flex;
		align-items: center;
	}

	.card-footer input {
		flex: 1;
		height: 70rpx;
		padding: 0 20rpx;
		border: 1rpx solid #ddd;
		border-radius: 8rpx;
	}

	.card-footer button {
		margin-left: 20rpx;
		height: 70rpx;
		line-height: 70rpx;
		padding: 0 30rpx;
		background: #007aff;
		color: #fff;
		border-radius: 8rpx;
	}
</style>